<script setup>
import SonComponent from '@/components/son-button.vue'
import { ref } from 'vue' 
const number = ref(1)
const changeNumber = () => {
  number.value++
}

const changeNum = (newValue) => {
  number.value = newValue
}
</script>

<template>
  <div>
    <h3>父组件 <button @click="changeNumber" class="myButton">修改Number 当前值：{{ number }}</button></h3>
    <!--子传父 通过 @ 事件接收-->
    <SonComponent @changeNum="changeNum" message="我是子组件" :number="number"></SonComponent>
  </div>
  
</template>

<style scoped>
.myButton {
  padding: 5px 30px;
  background-color: #63ccf6;
  border: 1px #0a8fff solid;
  color: white;
  border-radius: 5px;
}
</style>